<template>
    <div>
  
    姓名:<input v-model="user.name" /> <br/>
    年龄:<input v-model="user.age" /> <br/>
  
    <button @click="add" >提交</button>
  
    <div>展示用户列表</div>
    <ul>
    <li v-for="(user,index) in ulist" :key='index'>{{user.name}} {{user.age}}</li>
    </ul>
    </div>
    
  </template>
  
  <script>
  import axios from '@/http';
  export default {
      data(){
          return{
              user:{ name:'', age:''},
              ulist:[]
             
          }
      },
      methods: {
          add(){
              //调用 接口，把name,age
              axios.post('users/',this.user).then(res=>{
                  console.log(res)
                  if (res.code == 200) {
                      this.getlist()
                  }
              })
          },
  
          getlist(){
            axios.get('users/').then(data=>{
                console.log(data)
                this.ulist = data.ulist
              })
          }
      },
      mounted() {
          this.getlist()
      },
  }
  </script>
  
  <style>
  
  </style>